<template>
    <!-- 首页 -->
    <div class="home-view">
        <!-- 搜索框 -->
    <div class="search">
        <van-search  @click.stop="router.push('/search')" placeholder="请输入搜索关键词" input-align="center"/>
        </div>
        <!-- 菜单 -->
       
        <van-tabs v-model:active="baseStore.nowActive">
            <van-tab 
            v-for="item in baseStore.hotList" 
            :key="item.cat_id"
            :title="item.cat_name" 
            :name="item.cat_id"
            >
            </van-tab>
        </van-tabs>

    <!-- 根据条件渲染组件 -->
    <component
        :is="baseStore.nowActive == '0000' ? HotComponent : OtherComponent"
    >
    </component>

    </div>
    
 
</template>
<script setup lang="ts">
    import { ref } from "vue";
    
    
    //引入组件
    import HotComponent from '../../components/HotComponent.vue';

    import OtherComponent from '../../components/OtherComponent.vue';
   
    //引入菜单数据
    import { userBaseStore } from '../../store';


    let router = useRouter();

    let baseStore = userBaseStore();

    // let nowActive = ref('0000');

    // console.log(baseStore.bannerList);
    

   
    
</script>
<style  lang="less">
</style>
